html.protonmail {
	height: 100%;
	body {
		height: 100%;
		.blank { background: $white }
		.mobileOnly,
		.lowResolution { display: none }
		&.scroll {
			overflow-y: initial;
			-webkit-overflow-scrolling: touch;
			height: initial !important;
		}
		&.appConfigBody-is-mobile {
			height: 100vh;
            min-height: 100%;
			.desktopOnly {
				display: none !important;
			}
			.mobileOnly {
				display: block;
			}
			.mobile-display-column {
				@include flexColumn();
			}
			&.locked {
				overflow: initial !important;
			}
			&.appConfigBody-showSidebar {
				overflow: hidden !important;
				#pm_main {
					display: none;
				}
			}
			#body {
				height: initial;
				overflow: initial !important;
				#pm_main {
					height: calc(100vh - 70px);
				}
			}
		}
		&.appConfigBody-is-tablet,
		&.appConfigBody-is-mobile {
			.lowResolution { display: inline-flex; }
			.desktopOnly { display: none !important }
		}
		&.appConfigBody-is-mobile {
            .notMobile { display: none }
            .onmobile-mb-30p { margin-bottom: 30px; }
		}
	}
	.hidden {
		display: none !important;
	}
	.visionary {
		color: $visionary;
	}
	.plus {
		color: $plus;
	}
	.lifetime {
		color: #5FDEFB;
	}
	.professional {
		color: $professional
	}
	.background-primary {
		background: $primary;
	}
	.background-red-striped {
		background: $red-stripped;
	}
	.background-yellow-striped {
		background: $yellow-stripped;
	}
	.bold {
		font-weight: bold;
	}
	.uppercase {
		text-transform: uppercase;
	}
	.clear {
		clear: both;
	}
	.text-center {
		text-align: center;
	}
	.text-left {
		text-align: left;
	}
	.text-right {
		text-align: right;
	}
	.text-notransform {
        text-transform: none;
	}
    .text-gray {
        color: $default-color;
    }
    .text-light-gray {
        color: $default-color-light;
    }
    .text-green {
        color: $green;
    }
    .text-yellow {
        color: $yellow;
    }
    .text-red {
        color: $red;
    }
    .text-purple {
        color: $primary !important;
    }
    .text-blue-gray {
        color: $blue-gray;
    }
    .fill-gray {
        fill: $default-color;
    }
    .fill-light-gray {
        fill: $default-color-light;
    }
    .fill-green {
        fill: $green;
    }
    .fill-yellow {
        fill: $yellow;
    }
    .fill-red {
        fill: $red;
    }
    .fill-purple {
        fill: $primary !important;
    }
    .fill-blue-gray {
        fill: $blue-gray;
    }
	.border-panel {
		padding: 15px;
		border: 1px solid $border;
	}
	.padding-top {
		padding-top: 10px;
    }
    .margin-top-half {
		margin-top: 5px;
	}
	.margin-top {
		margin-top: 10px;
	}
	.margin-right {
		margin-right: 10px;
	}
	.margin-bottom {
		margin-bottom: 10px;
	}
	.margin-left {
		margin-left: 10px;
	}
	.spacing-top {
		margin-top: 3rem;
	}
	.spacing-bottom {
		margin-bottom: 3rem;
	}
	.flex-space-right { margin-right: 4px }
	.flex-space-left { margin-left: 4px }
	.flex-space-top { margin-top: 4px }
	.flex-space-bottom { margin-bottom: 4px }
	.no-margin {
		margin: 0;
	}
	.cursor-pointer{
		cursor: pointer;
	}
	.dull {
		opacity: .5;
	}
	.emphaseText {
		font-size:1rem;
	}
	.help {
		font-size: 12px;
		font-style: italic;
	}
	.or {
		font-size: 75%;
	}
	.ellipsis {
		display: inline-block;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
	.break-word {
		word-wrap: break-word;
	}
	.help-dnd {
		font-style: italic;
		opacity: .8
	}
	.help-dnd:before {
		margin-right: .5em;
	    font-family: FontAwesome;
		font-style: normal;
		content: "\F047";
	}

	::-webkit-input-placeholder { color: #aaaabf }
	:-moz-placeholder { color: #aaaabf }
	::-moz-placeholder {  color: #aaaabf }
	input:-ms-input-placeholder { color: #aaaabf }
	::-ms-input-placeholder { color: #aaaabf }
	:-ms-input-placeholder { color: #aaaabf }

	.placeholder-white {
		&::-webkit-input-placeholder { color: rgba(255,255,255,.75) }
		&:-moz-placeholder { color: rgba(255,255,255,.75) }
		&::-moz-placeholder {  color: rgba(255,255,255,.75) }
		&input:-ms-input-placeholder { color: rgba(255,255,255,.75) }
		&::-ms-input-placeholder { color: rgba(255,255,255,.75) }
		&:-ms-input-placeholder { color: rgba(255,255,255,.75) }
	}
}

input,
textarea,
select {
    background: $white;
}

a[href],
area[href],
input:not([disabled]),
select:not([disabled]),
textarea:not([disabled]),
button:not([disabled]),
iframe,
[tabindex],
[contentEditable=true] {
    &:not([tabindex='-1']):active {
		/* activable elements */
		outline: none;
	}
}

button,
input[type=button],
input[type=reset],
input[type=submit],
[role=button] {
	cursor: pointer;
}

fieldset {
	border: 1px solid $primary;
	padding: 1em;
	border-radius: $border-radius;
	margin-bottom: 1em;
}

/* removes X in input when typing in IE/EDGE */
input::-ms-clear {
    width: 0;
    height: 0;
}
/* removes native password revealer for IE/EDGE */
input::-ms-reveal {
    display: none;
}

fieldset legend {
	color: $primary;
	text-transform: uppercase;
	padding-left: .5em;
	padding-right: .5em;
}

.no-outline {
	outline: none;
}

.code {
	font-family: monospace;
	color: $black;
	border-radius: 2px;
	max-width: 100%;
	line-height: 1.35rem;
	overflow: auto;
	word-break: break-all;
	white-space: normal;
	padding: 0 .5rem;
	background-color: rgba(0,0,0,.06);
}
